<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="blogfragments :: head(~{::title})">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>分类新增</title>
  <link rel="stylesheet" href="../static/css/semantic.min.css">
  <link rel="stylesheet" type="text/css" href="../static/css/manster.css"/>
  <link rel="stylesheet" href="../static/plugins/editormd/css/editormd.css" />
</head>
<body>

  <!--导航-->
  <nav th:replace="blogfragments :: menu(2)" class="ui inverted attached segment m-padded-tb-mini"></nav>

  <div class="ui attached pointing menu">
    <div class="ui container">
      <div class="right menu">
        <a href="#" th:href="@{/admin/types/input}" class="active blue item">新增</a>
        <a href="#" th:href="@{/admin/types}" class="teal  item">列表</a>
      </div>
    </div>
  </div>

  <!--中间内容-->
  <div  class="m-container-small m-padded-tb-big" id="center">
    <div class="ui container">
      <form action="#" method="post" th:action="@{/admin/types/save}" th:object="${type}" class="ui form">
        <input type="hidden" name="id" th:value="*{id}">
        <div class="field">
          <div class="ui left labeled input">
            <label class="ui teal basic label">名称</label>
            <input type="text" name="name" placeholder="分类名称" th:value="*{name}" >
          </div>
        </div>

        <div class="ui error message"></div>
        <!--/*/
        <div class="ui negative message" th:if="${#fields.hasErrors('name')}">
          <i class="close icon"></i>
          <div class="header">提交失败：</div>
          <p th:errors="*{name}">分类名不可重复！</p>
        </div>
        /*/-->
        <div class="ui right aligned container">
          <button type="button" class="ui button" onclick="window.history.go(-1)" >返回</button>
          <button class="ui teal submit button">提交</button>
        </div>

      </form>
    </div>
  </div>

  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <!--底部footer-->
  <footer th:replace="blogfragments :: footer" class="ui inverted vertical segment m-padded-tb-large"></footer>

<!--/*/<th:block th:replace="blogfragments :: script">/*/-->
  <script src="../static/js/jquery-3.3.1.js"></script>
  <script src="../static/js/semantic.min.js"></script>
  <script type="text/javascript" color="240,248,255" opacity='0.8' zIndex="-1" count="99" src="../static/js/canvas-nest.js"></script>
  <script src="../static/plugins/editormd/editormd.min.js"></script>
<!--/*/</th:block>/*/-->

  <script>

    $('.menu.toggle').click(function () {
      $('.m-item').toggleClass('m-mobile-hide');
    });

    $('.ui.dropdown').dropdown({
      on : 'hover'
    });

    $('.ui.form').form({
      fields : {
        title : {
          identifier: 'name',
          rules: [{
            type : 'empty',
            prompt: '请输入分类名称！'
          }]
        }
      }
    });

  </script>
</body>
</html>